<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>title</title>
    <link rel="stylesheet" type="text/css" href="../css/public.css" />
    <style>
       #content {
		width: 100%;
		height: 100vh;
		background-color: #f3f3f3;
	}

	.topMain {
		width: 100%;
		height: 260px;
		background: #FFF;
		margin: 10px 0;
		font-size: 12px;
		color: #999999;
	}

	.topMain .topList {
		width: 100%;
		height: 130px;
	}

	.topMain .topList img {
		width: 50px;
		height: 50px;
		border-radius: 50%;
	}

	.topMain .topList .IDtext {
		width: 120px;
		height: 20px;
	}

	.copy {
		padding: 3px 5px;
		background-color: #EDEDED;
		border-radius: 5px;
		font-size: 10px;
		color: #333333;
	}

	.bottList {
		width: 100%;
		height: 130px;
	}

	.topOne {
		width: calc(100% - 30px);
		height: 50%;
		padding: 0 15px;
		font-size: 12px;
		color: #999999;
	}

	.topOne .one {
		width: 100px;
		height: 100%;
	}

	.footBox {
		width: 100%;
		height: calc(100% - 300px);
		color: #FFFFFF;
		font-size: 12px;
		margin-top: 5px;
		position: relative;
	}

	.footBox .head {
		width: 100%;
		height: 50px;
		background-color: #8F9DCC;
		border-radius: 10px 10px 0 0;
	}
	.footBox .head p {
		width: 48px;
		height: 100%;
		text-align: center;
		line-height: 50px;
	}
	.lists span{
		width: 48px;
		height: 100%;
		text-align: center;
		line-height: 13px;
		display: block;padding-left: 4px;padding-right: 4px;
		word-break: break-all;

	}

	.null {
		width: 120px;
		height: 100px;
		margin: 30px auto;
	}

	.null img {
		width: 100%;
		height: 80px;
		margin-bottom: 10px;
	}

	.null p {
		font-size: 17px;
		color: #DDDDDD;
		font-weight: 500;
	}
	.lists{background-color: #FFF;border-bottom: 1px solid #DDDDDD;padding-top: 20px;padding-bottom: 3px;}
    </style>
</head>

<body>
    <div id="content">
		
		<div class="topMain flex_column">
			<div class="topList flex_column_center">
				<img src="../image/img/rw_center1/bg_one.png" alt="">
				<p style="font-size: 17px;color: #333333;font-weight: 500; margin: 5px 0;">{{dataarr.name}}</p>
				<div class="IDtext flex_between">
					<p>ID：{{dataarr.id}}</p>
					<p class="copy" @click="copyTxt(dataarr.id)" >复制</p>
				</div>
				<p style="font-size: 10px;margin-top: 5px;">（注册时间：{{dataarr.time}}）</p>
			</div>

			<div class="bottList flex_column">
				<div class="topOne flex_around">
					<div class="one flex_column_center">
						<p style="color: #DB100B;font-size: 14px;font-weight: 500;">{{dataarr.countshouyi}}</p>
						<p>总收益(积分)</p>
					</div>
					<div class="one flex_column_center">
						<p style="color: #333333;font-size: 14px;font-weight: 500;">{{dataarr.chat}}</p>
						<p>私信收益(积分)</p>
					</div>
					<div class="one flex_column_center">
						<p style="color: #333333;font-size: 14px;font-weight: 500;">{{dataarr.sound}}</p>
						<p>语音收益(积分)</p>
					</div>
				</div>
				<div class="topOne flex_around">
					<div class="one flex_column_center">
						<p style="color: #333333;font-size: 14px;font-weight: 500;">{{dataarr.video}}</p>
						<p>视频收益(积分)</p>
					</div>
					<div class="one flex_column_center">
						<p style="color: #333333;font-size: 14px;font-weight: 500;">{{dataarr.gift}}</p>
						<p>礼物收益(积分)</p>
					</div>
					<div class="one flex_column_center">
						<p style="color: #333333;font-size: 14px;font-weight: 500;">{{dataarr.tuiguang}}</p>
						<p>邀请奖励(积分)</p>
					</div>
				</div>
			</div>
		</div>

		<div class="footBox flex_column">
			<div class="head flex_around">
				<p>日期</p>
				<p>私信收益</p>
				<p>视频收益</p>
				<p>语音收益</p>
				<p>礼物收益</p>
				<p>邀请收益</p>
				<p>收益</p>
			</div>

			<div class="lists flex_around" v-for="(item,index) in dataarr.data" v-if="dataarrlength>0" style="color: #333;">

					<span>{{item.time}}</span>
					<span>{{item.data.chat}}</span>
					<span>{{item.data.video}}</span>
					<span>{{item.data.sound}}</span>
					<span>{{item.data.gift}}</span>
					<span>{{item.data.tuiguang}}</span>
					<span>{{item.data.countshouyi}}</span>

				
			</div>

			<div class="null flex_column_center" v-if="!dataarrlength">
				<img src="../image/img/invite/null.png" alt="">
				<p>暂无数据</p>
			</div>
		</div>






	</div>
</body>
<script type="text/javascript" src="../script/api.js"></script>
<script type="text/javascript" src="../script/jquery.js"></script>
<script type="text/javascript" src="../script/vue.js"></script>
<script type="text/javascript" src="../script/ffkj.js"></script>
<script type="text/javascript" src="../script/update.js"></script>
<script type="text/javascript" src="../script/swiper.js"></script>
<script type="text/javascript" src="../script/jdate.min.js"></script>
<script src="../script/select_json.js"></script>
<script type="text/javascript" src="../json/imglist.js"></script>
<script type="text/javascript" src="../json/user.js"></script>
<script type="text/javascript" src="../json/rw.js"></script>
<script type="text/javascript">
    var userid;
    var view = new Vue({
        el: '#content',
        data: {
			dataarr:[],
			user:[],
			id:'',
			dataarrlength:0
        },
        methods: {
			returnImg(url) {
                return returnImg(url);
            },
			_url(param, url) {
                _url(param, url);
            },
			copyTxt(text) {
                copyTxt(text)
            },
        }
    });

    apiready = function() {
        view.ios = $api.getStorage('shang');
        userid = $api.getStorage('userid');
    	view.user=$api.getStorage('user');
		view.id=api.pageParam['id'];
		_daydata()
    };

	

	function _more() {
        _url({
            url: 'frame4/yaoqing',
            title: '我的邀请'
        })
    }
	
	function _daydata() {
        _ajax('api/User/xiangqing', function(ret, err) {
            if (ret && ret.data) {
				view.dataarr=ret.data
				view.dataarrlength=view.dataarr.data.length
            }else{
				//_msg(ret.msg)
				api.historyBack({
				},function(rets,err){
					alert(ret.msg)
					if (!rets.status) {
						api.closeWin();
					}
				});
			}
        },{
			user_id: $api.getStorage('userid'),
			id:view.id
		})
    }
	

</script>

</html>